<!DOCTYPE html>
<html lang="en-US" ng-csp="no-unsafe-eval">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="shortcut icon" href="{{ STATIC_URL }}assets/favicon.ico?v={{version}}" />
    <script>
        var $basePath = '{{ STATIC_URL }}';
        window.liveUpdates = "{{ UI_LIVE_UPDATES_ENABLED }}" === "False" ? false : true;
    </script>
    <% htmlWebpackPlugin.files.css.forEach(file => {%>
        <link href="{{ STATIC_URL }}<%= file %>" rel="stylesheet" />
    <% }) %>
    <% htmlWebpackPlugin.files.js.forEach(file => {%>
        <script src="{{ STATIC_URL }}<%= file %>"></script>
    <% }) %>
</head>

<body data-user-agent="{{userAgent}}">
    {% verbatim %}
    <at-layout>
        <bread-crumb></bread-crumb>
        <toast></toast>
        <div class="container-fluid" id="content-container">
            <div class="row">
                <div class="col-lg-12" ui-view></div>
            </div>
            <!-- Password Dialog -->
            <div id="password-modal" style="display: none;"></div>
            <div id="idle-modal" style="display:none" translate>Your session will expire in <span id="remaining_seconds" class="IdleModal-remainingSeconds">60</span> seconds, would you like to continue?</div>
            <stream-detail-modal></stream-detail-modal>
            <!-- Confirmation Dialog -->
            <div id="prompt-modal" class="modal fade">
                <div class="modal-dialog">
                    <div class="Modal-content modal-content">
                        <div class="Modal-header">
                            <div class="Modal-title" id="prompt-header">
                                <span ng-bind="promptHeader"></span>
                                <span class="Modal-titleResourceName" ng-bind="promptResourceName"></span>
                            </div>
                            <div class="Modal-exitHolder">
                                <button aria-label="{{:: appStrings.get('CLOSE')}}" class="close Modal-exit" data-target="#prompt-modal" data-dismiss="modal"><i class="fa fa-times-circle"></i></button>
                            </div>
                        </div>
                        <div class="Modal-body" ng-bind-html="promptBody" id="prompt-body">
                        </div>
                        <div class="Modal-footer">
                            <a href="#" data-target="#prompt-modal" data-dismiss="modal" id="prompt_cancel_btn" class="btn Modal-defaultButton Modal-footerButton" ng-bind="cancelActionText"></a>
                            <a href="" ng-hide="hideActionButton" ng-class="promptActionBtnClass" ng-click="promptAction()" id="prompt_action_btn" class="btn Modal-footerButton" ng-bind="promptActionText"></a>
                        </div>
                    </div>
                    <!-- modal-content -->
                </div>
                <!-- modal-dialog -->
            </div>
            <!-- modal -->
            <!-- Alerts/error handling dialogs -->
            <div id="alert-modal" class="modal fade">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h3 id="alertHeader" ng-bind="alertHeader"></h3>
                            <button aria-label="{{:: appStrings.get('CLOSE')}}" type="button" class="close" ng-hide="disableButtons" data-target="#alert-modal" data-dismiss="modal" class="modal"><i class="fa fa-times-circle"></i></button>
                        </div>
                        <div class="modal-body">
                            <div id="alert-modal-msg" class="alert" ng-bind-html="alertBody"></div>
                        </div>
                        <div class="modal-footer">
                            <a href="#" ng-hide="disableButtons" data-target="#form-modal" data-dismiss="modal" id="alert_ok_btn" class="btn btn-default" translate>OK</a>
                        </div>
                    </div>
                    <!-- modal-content -->
                </div>
                <!-- modal-dialog -->
            </div>
            <!-- modal -->
            <div id="alert-modal2" class="modal fade">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button aria-label="{{:: appStrings.get('CLOSE')}}" type="button" class="close" data-target="#alert-modal2" data-dismiss="modal" ng-hide="disableButtons2">&times;</button>
                            <h3 id="alertHeader2" ng-bind="alertHeader2"></h3>
                        </div>
                        <div class="modal-body">
                            <div id="alert2-modal-msg" class="alert" ng-bind-html="alertBody2"></div>
                        </div>
                        <div class="modal-footer">
                            <a href="#" ng-hide="disableButtons2" data-target="#form-modal2" data-dismiss="modal" id="alert2_ok_btn" class="btn btn-primary">OK</a>
                        </div>
                    </div>
                    <!-- modal-content -->
                </div>
                <!-- modal-dialog -->
            </div>
            <!-- modal -->
            <div id="login-modal-dialog" style="display: none;"></div>
            <div id="help-modal-dialog" style="display: none;"></div>
            <div id="prompt-for-days" style="display:none">
                <form name="prompt_for_days_form" id="prompt_for_days_form" class="MgmtCards-promptText">
                    <span translate>Set how many days of data should be retained.</span>
                    <br>
                    <input type="integer" id="days_to_keep" name="days_to_keep" ng-model="days_to_keep" ng-required="true" class="form-control Form-textInput" min=0 max=9999 style="margin-top:10px;" integer>
                    <div class="error" ng-show="prompt_for_days_form.days_to_keep.$dirty && (prompt_for_days_form.days_to_keep.$error.number || prompt_for_days_form.days_to_keep.$error.integer ||
                prompt_for_days_form.days_to_keep.$error.required ||
                prompt_for_days_form.days_to_keep.$error.min ||
                prompt_for_days_form.days_to_keep.$error.max)" translate>Please enter an integer<span ng-show="prompt_for_days_form.days_to_keep.$dirty && prompt_for_days_form.days_to_keep.$error.min"> that is not negative</span><span ng-show="prompt_for_days_form.days_to_keep.$dirty && prompt_for_days_form.days_to_keep.$error.max"> that is lower than 9999</span>.</div>
                </form>
            </div>
            <div id="prompt-for-days-facts" style="display:none">
                <form name="prompt_for_days_facts_form" id="prompt_for_days_facts_form" class="MgmtCards-promptText">
                    <div style="padding-bottom:15px;"><span translate>For facts collected older than the time period specified, save one fact scan (snapshot) per time window (frequency). For example, facts older than 30 days are purged, while one weekly fact scan is kept.</span>
                        <br>
                        <br>
                        <span translate>CAUTION: Setting both numerical variables to "0" will delete all facts.</span>
                        <br>
                        <br>
                    </div>
                    <div class="form-group">
                        <label for="description">
                            <span class="label-text" translate>Select a time period after which to remove old facts</span>
                        </label>
                        <div class="row">
                            <div class="col-xs-6">
                                <input type="integer" id="keep_amount" name="keep_amount" ng-model="keep_amount" ng-required="true" class="form-control Form-textInput MgmtCards-card--promptElements" min=0 max=9999 integer></input>
                            </div>
                            <div class="col-xs-6">
                                <select id="keep_unit" name="keep_unit" ng-model="keep_unit" ng-options="type.label for type in keep_unit_choices track by type.value" ng-required="true" class="form-control"></select>
                            </div>
                        </div>
                        <div class="error" ng-show="prompt_for_days_facts_form.keep_amount.$dirty && (prompt_for_days_facts_form.keep_amount.$error.number || prompt_for_days_facts_form.keep_amount.$error.integer ||
                        prompt_for_days_facts_form.keep_amount.$error.required ||
                        prompt_for_days_facts_form.keep_amount.$error.min ||
                        prompt_for_days_facts_form.keep_amount.$error.max)" translate>Please enter an integer<span ng-show="prompt_for_days_facts_form.keep_amount.$dirty && prompt_for_days_facts_form.keep_amount.$error.min"> that is not negative</span><span ng-show="prompt_for_days_facts_form.keep_amount.$dirty && prompt_for_days_facts_form.keep_amount.$error.max"> that is lower than 9999</span>.</div>
                    </div>
                    <div class="form-group ">
                        <label for="description">
                            <span class="label-text" translate>Select a frequency for snapshot retention</span>
                        </label>
                        <div class="row">
                            <div class="col-xs-6">
                                <input type="integer" id="granularity_keep_amount" name="granularity_keep_amount" ng-model="granularity_keep_amount" ng-required="true" class="form-control Form-textInput MgmtCards-card--promptElements" min=0 max=9999 integer></input>
                            </div>
                            <div class="col-xs-6">
                                <select id="granularity_keep_unit" name="granularity_keep_unit" ng-model="granularity_keep_unit" ng-options="type.label for type in granularity_keep_unit_choices track by type.value" ng-required="true" class="form-control"></select>
                            </div>
                        </div>
                        <div class="error" ng-show="prompt_for_days_facts_form.granularity_keep_amount.$dirty && (prompt_for_days_facts_form.granularity_keep_amount.$error.number || prompt_for_days_facts_form.granularity_keep_amount.$error.integer ||
                        prompt_for_days_facts_form.granularity_keep_amount.$error.required ||
                        prompt_for_days_facts_form.granularity_keep_amount.$error.min ||
                        prompt_for_days_facts_form.granularity_keep_amount.$error.max)" translate>Please enter an integer<span ng-show="prompt_for_days_facts_form.granularity_keep_amount.$dirty && prompt_for_days_facts_form.granularity_keep_amount.$error.min"> that is not negative</span><span ng-show="prompt_for_days_facts_form.granularity_keep_amount.$dirty && prompt_for_days_facts_form.granularity_keep_amount.$error.max"> that is lower than 9999</span>.</div>
                    </div>
                </form>
            </div>
            <div class="overlay"></div>
            <div class="spinny"><i class="fa fa-cog fa-spin fa-2x"></i>
                <p translate>working...</p>
            </div>
        </div>
    </at-layout>
    {% endverbatim %}
</body>

</html>
